{% extends 'layout.html' %}
{% block main %}
    <script type=text/javascript>
        $(function() {
            p=1;
            function vi(p){
                $.get($SCRIPT_ROOT + '/searchres?page='+p+'&'+ $("#searchform").serialize(), function(data) {
                    $("#searchcontent").html(data);
                    $("#pagebar a").click(function(e){//对分页栏中的a元素进行操作
                        e.preventDefault();//阻止a的原先事件
                        vi($(this).attr("id"));//根据获取的页码值调用显示页面函数
                    });
                    $("#page_go").click(function(e){//对分页栏中的input元素进行操作
                        e.preventDefault();
                        if (isNaN($("#page_val").val())||$.trim($("#page_val").val())==""){//判断输入的是否是数字
                            alert("输入的页码错误，请输入正确页码！");
                            $("#page_val").select();
                            return false;//页码值不是数字则退出；
                        }
                        vi($("#page_val").val());
                    });
                    $(".fee").cluetip({
                                          showTitle: false,
                                          activation: 'click',
                                          clickThrough: false,
                                          onShow: function(ct, c){
                                              $("#cluetip").css({"width":"auto","max-width":"400px"});
                                          }
                                      });
                    {#                    $( document ).tooltip();#}




                });
                //return false;
            }
            $('#searchbutton').bind('click', function() {
                vi(p);
            });
            vi(p);
            $('body').bind('click', function(event) {
                event = event.originalEvent;
                var tgt = event.target,
                        $tgt = $(tgt);
                if ( !$tgt.closest('div.cluetip').length ) {
                    $(document).trigger('hideCluetip');
                }
            });

        });
    </script>

                <section id="searchbar" class="box info">
                    <form id="searchform">

                        <label for="comm">小区</label>
                        <input type="hidden" name="commid" value="{{ commid or '0' }}" />
                        <input type="search" class="ac_comm" name="comm" value="{{ comm or '' }}" />
                        <label for="addr">地址</label>
                        <input type="hidden" name="addrid" value="{{ addrid or '0' }}" />
                        <input type="search" class="ac_addr" name="addr" value="{{ addr or '' }}" />
                        <select name='area'>
                            <option value="0">片区</option>
                            {% for area in areas %}
                            <option value="{{ area.AreaID }}">{{ area.AreaName }}</option>
                            {% endfor %}
                        </select>
                        <select name="empe">
                            <option value="0">人员</option>
                            {% for empe in empes %}
                                <option value="{{ empe.EmpeID }}">{{ empe.EmpeName }}</option>
                            {% endfor %}
                        </select>
                        <label for="inputdate">录入日期</label>
                        <input class="datepicker" name="inputstart" size="10" readonly="readonly" />
                        -
                        <input class="datepicker" name="inputend" size="10" readonly="readonly" />
                        <button id="searchbutton" type="button" class="ym-button">查询</button>

                    </form>
                </section>
                <section id="searchcontent" class="ym-grid linearize-level-1"></section>

{% endblock main %}